<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>录入自定义页面</title>

    <!-- 引入 css -->
    <link href="/admin/plugin/wangEditor/style.css" rel="stylesheet">
    <!-- 引入 js -->
    <script src="/admin/plugin/wangEditor/index.js"></script>

    <!--引入 element-ui 的样式，-->
    <link rel="stylesheet" href="/admin/plugin/element-ui/index.css">
    <!-- 必须先引入vue，  后使用element-ui -->
    <script type="text/javascript" src="/admin/js-css/js/vue.min.js"></script>
    <!-- 引入element 的组件库-->
    <script type="text/javascript" src="/admin/plugin/element-ui/index.js"></script>

    <script type="text/javascript" src="/admin/plugin/element-ui/httpVueLoader.js"></script>

    <!--引入layui组件-->
    <link rel="stylesheet" href="/admin/plugin/layui/dist/css/layui.css" tppabs="http://res.layui.com/layui/dist/css/layui.css"  media="all">
    <script src="/admin/plugin/layui/dist/layui.js" charset="utf-8"></script>

    <script type="text/javascript" src="/admin/js-css/js/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="/admin/js-css/js/mx1.0.js?v=1.1"></script>
	<link rel="stylesheet" href="/admin/js-css/css/backColor.css" media="all">



    <style>
        .changeLHight .el-form-item__label{
            line-height: 16px !important;
        }
    </style>

</head>
<body style="overflow-y: auto;">

<div id="app">




    <el-row >
        <el-collapse v-model="activeNames" >
            <el-collapse-item :title="item.name" :name="index"  v-for="(item,index) in listdata" >
                <div>
                    <template v-for="(itemfj,index1) in item.listfj" >
                        <el-button v-if="itemfj.fjzt == '出租'" style="margin: 5px 5px;background:rgb(221 221 35);"  :type="itemfj.type" plain  @click="jiaokuan(itemfj.id)" >{{itemfj.name}} / {{itemfj.zhxm}} / 面积：{{itemfj.jzmj}}m²
						<span v-if="itemfj.zhxm == '空房间'"><i class="el-icon-message-solid" style="color: #000;"></i></span>
						</el-button>

                        <el-button v-else style="margin: 5px 5px;"  :type="itemfj.type" plain @click="jiaokuan(itemfj.id)" >{{itemfj.name}} / {{itemfj.zhxm}} / 面积：{{itemfj.jzmj}}m²
                            <span v-if="itemfj.zhxm == '空房间'"><i class="el-icon-message-solid" style="color: #000;"></i></span>
                        </el-button>
                    </template>
                </div>

                <!--<div style="text-align: center;">
                    <el-button style="width: 300px;" @click="loadGengduo(item.id,index)">加载更多</el-button>
                </div>-->
            </el-collapse-item>

        </el-collapse>


        <template v-if="listdata.length == 0">
            没有房间进行展示
        </template>


    </el-row>

    <el-row style="margin-top: 20px;">
        <template v-if="listdata.length > 0" >
            说明：红色显示欠历年 黄色显示欠本期 蓝色不欠费  黄金色显示出租
        </template>
    </el-row>



</div>

<script>




    var vm = new Vue({
        el: '#app',
        data: {
            activeNames:[],
            parmsData:{},
            listdata:[],
            pageNumberObj:{},
        },
        async created(){
            let mapda = getParams();
            this.parmsData = mapda;
            this.getData();
        },
        methods:{
            jiaokuan(fjid){
              window.location.href = "/admin/html/module/sichuangwuye/hesuan/jiaokuanList.html?type=5&id="+fjid;
            },
            async getData(){
                let dp = {};
                if(this.parmsData.code == "625"){//点击的大楼
                    dp["ldid"] = this.parmsData.id;
                }
                if(this.parmsData.code == "626"){//点击的单元
                    dp["pid"] = this.parmsData.id;
                }
                let i = load();
                const res = await postWebCustom(getTableId("726"),{"code":""+this.parmsData.code,"id":""+this.parmsData.id});
                layer.close(i);
                this.listdata = res.data;
                for(let a=0;a<this.listdata.length;a++){
                    this.activeNames.push(a);
                }
            },
            //加载更多
            async loadGengduo(dyid,index){
                if(this.pageNumberObj[dyid] == undefined){
                    this.pageNumberObj[dyid] = 1;
                }
                let i = load();
                const res = await postWebCustom(getTableId("910"),{dyid:dyid,pageNumber:""+this.pageNumberObj[dyid]});
                layer.close(i);
                if(res.data.length == 0){
                    top.alert("没有更多了...");
                    return;
                }
                this.listdata[index].listfj = [...this.listdata[index].listfj,...res.data];
                this.pageNumberObj[dyid] = parseInt(this.pageNumberObj[dyid])+1;

            }

        },

    })


</script>


</body>
</html>
